<template>
	<view>
		<uni-nav-bar @clickLeft='clickLeft()'	 left-icon="left" statusBar title="钱包余额" :border='false' color="#000" fixed backgroundColor='#ffffff00'>
		</uni-nav-bar>
		<image class="BGImage" :src="getImageUrl('/static/common/BG.png')" mode=""></image>
		<view class="" style="position: relative;z-index: 2;">
			<view class="view2">
				<view class="flex-row-space-between">
					<view class="title flex-row-flex-start">
						钱包余额(元)
						<text style="font-size: 22rpx;">钱包说明</text>
					</view>
					
					<view class="button flex-row-center">
						去买金
						<uni-icons type="right" size="14" color="#F54C0D"></uni-icons>
					</view>
				</view>
				<view class="title1">
						<text style="font-size: 22rpx;">￥</text>
					166.00
				</view>
				<view class="title1 flex-row-flex-start" style="font-size: 26rpx;">
						
					钱包密码 <uni-icons type="right" size="16" color="#FFF"></uni-icons>
				</view>
			</view>
			<view class="view1">
				<u-tabs bold :current="tabsIndex" @click="tabClick" style="background-color: #FFFFFF00;" :list="tabsList"
					lineWidth="32" lineColor="#F54C0D" :activeStyle="{
											color: '#1A1A16',
											
											transform: 'scale(1)',
											fontWeight:'bold'
											
										}" :inactiveStyle="{
											color: '#535353',
											transform: 'scale(1)'
										}" itemStyle="  height: 44px;width:16.66%">
				</u-tabs>
				<u-empty>
				</u-empty>
			</view>

		</view>
		
		<view class="fixed-bottom flex-row-space-between" style="padding: 28rpx;background: #FFF;">
			<view class="button1 flex-row-center">
				提现
			</view>
			<view class="button2 flex-row-center">
			充值
			</view>
		</view>

	</view>
</template>

<script>
	import {
		mapActions,
		mapState
	} from "vuex";
	import {
		profile,
	} from '@/api/index.js'
	export default {
		components: {},
		computed: {

		},
		data() {
			return {
				tabsIndex: 0,
				tabsList: [{
						name: '全部',
						status: ""
					},
					{
						name: '贷款',
						status: "0"
					},
				
					{
						name: '充值',
						status: "1"
					},
					{
						name: '佣金',
						status: "2"
					},
					{
						name: '支付',
						status: "3"
					},
					{
						name: '提现',
						status: "3"
					},
				],


			}
		},
		computed: {
			...mapState([
				'baseColor'
			]),
		},
		onPageScroll(e) {
			if (e.scrollTop > 20) {
				this.backgroundColor = "#AED0FC"
			} else {
				this.backgroundColor = "#ffffff00"
			}
		},
		onShow() {
			// this.userinfo=uni.getStorageSync('userinfo')
			// 			this.profile()
		},
		onLoad(e) {

			// this.loadData()
		},
		//下拉刷新
		onPullDownRefresh() {


		},
		//加载更多
		onReachBottom() {

		},
		onPageScroll(e) {
			// if (e.scrollTop > 20) {
			// 	this.backgroundColor = "#FBF9FF"
			// } else {
			// 	this.backgroundColor = "#ffffff00"
			// }
		},
		methods: {
			clickLeft(){
			uni.navigateBack()	
			},
			itemClick(item) {
				if (item.url) {
					this.toUrl(item.url)
				} else {
					this.showToast('请先实名')
				}
			},
			roleClick() {
				if (this.userinfo.group_id == 3 || this.userinfo.group_id == 0) {
					return
				}
				uni.navigateTo({
					url: '/pages/index/setRole'
				})
			},
			profile() {

				var data = {

				}
				profile(data).then(res => {

					uni.setStorageSync('userinfo', res.data)
					this.userinfo = uni.getStorageSync('userinfo')


				})
			},
			buttonClick() {
				uni.removeStorageSync('token')
				uni.navigateTo({
					url: '/pages/login/login'
				})
			},
			loadData() {

				var data = {
					id: this.id
				}
				forum_list(data).then(res => {
					this.list = res.data.data
				})
			},


		}
	}
</script>

<style lang="scss">
.view1{
	padding: 28rpx;
	margin: 28rpx;
	background: #fff;
	box-shadow: 0rpx 3rpx 6rpx 1rpx rgba(204,204,204,0.16);
	border-radius: 8rpx 8rpx 8rpx 8rpx;
}
.view2{
	padding: 28rpx;
	margin: 28rpx;
	background: #F19D4A;
	box-shadow: 0rpx 3rpx 6rpx 1rpx rgba(204,204,204,0.16);
	border-radius: 8rpx 8rpx 8rpx 8rpx;
}
.title{
	font-weight: 400;
	font-size: 30rpx;
	color: #FFFFFF;

}
.button{
	width: 142rpx;
	height: 52rpx;
	background: #FFFFFF;
	border-radius: 26rpx 26rpx 26rpx 26rpx;
	font-weight: 400;
	font-size: 26rpx;
	color: #F54C0D;
}

.title1{
	margin-top: 20rpx;
font-weight: 400;
font-size: 32rpx;
color: #FFFFFF;
}
.button1{
	width: 337rpx;
	height: 92rpx;
	background: #ECECEC;
	border-radius: 10rpx 10rpx 10rpx 10rpx;
	font-weight: 400;
	font-size: 32rpx;
	color: #111010;
}
.button2{
	width: 337rpx;
	height: 92rpx;
	background: linear-gradient( 88deg, #FA3819 0%, #F5620D 100%);
	box-shadow: 0rpx 5rpx 13rpx 1rpx rgba(245,98,13,0.37);
	border-radius: 10rpx 10rpx 10rpx 10rpx;
	font-family: SimHei, SimHei;
	font-weight: 400;
	font-size: 32rpx;
	color: #FFFFFF;
}
</style>